<template>
  <view class="container screen-width">
    <u-form :model="form" ref="uForm" :error-type="['toast']">
      <view class="box">
        <view class="box-item u-flex">
          <view class="name">新邮箱</view>
          <input v-model="form.newEmail" placeholder="请输入要绑定的邮箱" />
        </view>
      </view>
    </u-form>
    <view class="submitBtn screen-width" @click="submit">提交</view>
    <Festival></Festival>
  </view>
</template>

<script>
import { changeEmail } from "../../util/api/user";
import {isEmail} from '../../util/validator'
export default {
  data() {
    return {
      oldTel: "",
      tips1: "",
      tips2: "",
      form: {
        newEmail: ""
      },
    };
  },
  onLoad(query) {
    this.oldTel = query.value;
  },
  onReady() {
    this.$refs.uForm.setRules(this.rules);
  },
  methods: {
    code1Change(text) {
      this.tips1 = text;
    },
    code2Change(text) {
      this.tips2 = text;
    },
    submit() {
        if(!isEmail(this.form.newEmail)){
            this.$u.toast("请输入正确的邮箱");
            return
        }

        changeEmail(this.form.newEmail).then(res => {
            if (res.code == 200) {
                uni.showToast({
                    title: "修改成功",
                    duration: 2000,
                    icon: "none"
                });
            }
            uni.navigateBack();
        });
    },
  }
};
</script>

<style lang="less" scoped>
.container {
  position: relative;

  .submitBtn {
    position: fixed;
    bottom: 0;
    width: 100%;
    height: 88rpx;
    background: #1678ff;
    line-height: 88rpx;
    text-align: center;
    color: #fff;
  }
}
.box {
  margin-top: 20rpx;
  padding: 0 30rpx;
  background: #fff;
  font-size: 32rpx;
  font-family: PingFang SC, PingFang SC-Regular;
  font-weight: 400;
  text-align: left;
  color: #333333;

  &-item {
    height: 100rpx;
    border-bottom: 1rpx solid #f1f1f1;
    display: flex;
    justify-content: space-between;
    align-items: center;
    .name {
      // margin-right: 72rpx;
      justify-content: space-between;
    }
  }

  .btn {
    height: 64rpx;
    opacity: 1;
    background: #e8f3ff;
    border-radius: 8rpx;
    font-size: 26rpx;
    font-family: PingFang SC, PingFang SC-Regular;
    font-weight: 400;
    text-align: right;
    color: #1678ff;
    padding: 14rpx;
  }
}
</style>
